<%--
  Created by IntelliJ IDEA.
  User: 李学健
  Date: 2024/3/10
  Time: 11:36
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
</head>
<body>
<h1>
    欢迎来到聊天室：
    <br>
    输入你的用户名,密码是123
</h1>

<%--不要忘记给form表单命名，不然js代码不能通过参数找到--%>
<form onsubmit="return isvalid()" method="post" action="index02.jsp"
      style=" text-align: center;vertical-align: middle" name="form1">
    <label>
        用户名：
        <input name="username" id="username" type="text" size="24">
    </label><br>
    <label>
        密码：
        <input name="password" id="password" type="password" size="24">
    </label><br>
    <input type="submit" value="提交">
    <input type="reset" value="重置">
</form>

<script>
    //不知道为什么，参照老师的写法不能接收到参数，我参考Bito的Ai的建议很快解决了问题
    function isvalid() {
        var username = document.getElementById("username").value;
        var password = document.getElementById("password").value;
        if (username.trim() === "") {
            alert("输入用户名吧！😊😊😊");
            document.form.username.focus();
            return false; // 阻止提交表单
        }
        if (password.trim() === "") {
            alert("输入密码吧！😅😅😅");
            document.form.username.focus();
            return false;
        }
        return true; // 提交表单
    }
</script>

</body>
</html>
